<!--
 * @description  : 市管-特殊区域检查详情
 * @descriptionDetail: 市管-特殊区域检查详情
 * @copyright    : 浙江烟草
 * @author       : sy
 * @create       : 2022-10-20 10:57:44
-->
<template>
	<view class="page">
		<!-- #ifdef H5-ONLY -->
		<theme-navbar :is-white="false" :title="navTitle" :custom-back="goBack" style="z-index: 99999">
		</theme-navbar>
		<!-- #endif -->
		<view class="content u-page">
			<view class="u-tabs-box" style="width: 100px;">
				<u-tabs :list="tabList" :is-scroll="false" :current="currentTab"></u-tabs>
			</view>
			<u-gap :height="$theme.cm_section_top_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
			<fsection :title="title.signIn" class="pl-16 ma-16"></fsection>
			<u-gap :height="$theme.cm_section_top_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
			<u-form class="u-form-m ma-16" label-width="auto" label-position="left" ref="uForm">
				<u-form-item label="签到">
					<text @click="signInClick" style="float:right;right:0;position:absolute;color:#0070D2">点击签到</text>
				</u-form-item>
			</u-form>
			<u-gap :height="$theme.cm_section_top_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
			<fsection :title="title.basemsg" class="pl-16 ma-16"></fsection>
			<u-gap :height="$theme.cm_section_top_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
			<u-form class="u-form-m ma-16" :model="baseInfo" :error-type="['border-bottom', 'message',]" label-width="auto" label-position="left" ref="uForm">
				<u-form-item v-for="item,index in visitPublicityCodes" :label="item.bcbName" :key="index">
					<u-switch v-model="item.isActive" style="margin-left: auto"></u-switch>
				</u-form-item>
			</u-form>
			<u-gap :height="$theme.cm_section_top_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
			<fsection :title="title.servicemsg" class="pl-16 ma-16"></fsection>
			<u-gap :height="$theme.cm_section_top_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
			<u-form class="u-form-m ma-16" :model="baseInfo" :error-type="['border-bottom', 'message',]" label-width="auto" label-position="left" ref="uForm">
				<u-form-item v-for="item,index in visitServiceCodes" :label="item.bcbName" :key="index">
					<u-switch v-model="item.isActive" style="margin-left: auto"></u-switch>
				</u-form-item>
			</u-form>
		</view>
    <view style="padding:20px; margin:0 30px;">
      <u-button type="primary" shape="circle" @click="submitAudit">保存</u-button>
    </view>
	</view>
</template>

<script>
	import checkService from "@/service/check/check.service";
	import fsection from "@/components/form-section.vue";
	import {
		isDD,
		isWorkWechat,
    isEmpApp
	} from '@/common/util';
	import {
		SET_MAP_LAT_LON
	} from '@/config/setting.config.js';
	import queryService from '@/service/check/query.service';

	export default {
		components: {
			fsection
		},
		data() {
			return {
				signIn: false,
				currentTab: 0,
				baseInfo: {
					isInternetCase: false
				},
				tabList: [{
					name: '走访事项'
				}],
				title: {
					signIn: '签到',
					basemsg: "走访-宣传类",
					servicemsg: "走访-服务类"
				},
				params: {
					retailerUuid: '',
					taskSubject: '',
					visitServiceCodes: [],
					visitPublicityCodes: []
				},
				visitServiceCodes: [],
				visitPublicityCodes: [],
				longitude: 0, // 经度
				latitude: 0, // 纬度
				visitSuccessBean: '' // 签到成功后存储的数据
			}
		},
		onLoad(options) {
			this.params.retailerUuid = options.retailerUuid;
			this.params.taskSubject = options.taskSubject;
		},
		methods: {
			signInClick(){
				if (this.visitSuccessBean) {
					return this.$u.toast('请勿重复签到')
				}
				let isHaveLngLat = false;
				if (this.longitude == 0 && this.latitude == 0) {
					this.$modal.alert('获取当前位置信息失败,请稍后重新签到？', () => {
						this.getLocation();
					});
					return;
				}
				let params = {
					longitude: '',
					latitude: '',
					retailerUuid: '',
					deviateDistance: '',
					taskSubject: ''
				}
				this.$u.loading('正在计算当前位置...');
				checkService.retailerDetail({
					retailerUuid: this.params.retailerUuid
					}).then((dr) => {
					if (dr.success) {
						let retailerInfo = dr.bean // 存储零售户信息
						params.longitude = this.longitude;
						params.latitude = this.latitude;
						params.retailerUuid = this.params.retailerUuid
						params.taskSubject = this.params.taskSubject
						// 计算签到距离
						if (retailerInfo.longitude && retailerInfo.latitude) {
							isHaveLngLat = true;
							let p1 = new AMap.LngLat(retailerInfo.longitude, retailerInfo.latitude);
							let p2 = new AMap.LngLat(params.longitude, params.latitude);
							params.deviateDistance = Math.round(p1.distance(p2));
							console.log('两点相距=' + params.deviateDistance);
						} else {
							// 没有坐标默认偏离
							params.deviateDistance = 996996996;
						}
						checkService.saveVisitRecord(params).then((drr) => {
							if (drr.success) {
								this.$u.toast('签到成功');
								this.visitSuccessBean = drr.bean
								this.$u.hideLoading();
							} else {
								this.$u.toast('签到异常');
								this.visitSuccessBean = ''
								this.$u.hideLoading();
							}
						})
						.catch((err) => {
							this.$u.hideLoading();
							this.$u.toast(err);
						});
					} else {
						this.$u.toast('零售户获取异常');
						this.$u.hideLoading();
					}
				})
				.catch((err) => {
					this.$u.hideLoading();
					this.$u.toast(err);
				});
			},
			// 定位
			getLocation() {
				if (isDD() || isWorkWechat() || isEmpApp()) {
					this.$deviceApi.geolocation().then((geo) => {
						this.longitude = geo.longitude;
						this.latitude = geo.latitude;
					});
				} else {
					this.longitude = SET_MAP_LAT_LON[0];
					this.latitude = SET_MAP_LAT_LON[1];
				}
			},
			submitAudit() {
				if (!this.visitSuccessBean) {
					return this.$u.toast('请先签到！')
				}
				let visitServiceCodes = [];
				let visitPublicityCodes = [];
				this.visitServiceCodes.forEach(item => {
					if (item.isActive) {
						visitServiceCodes.push(item.bcbCode)
					}
				})
				this.visitPublicityCodes.forEach(item => {
					if (item.isActive) {
						visitPublicityCodes.push(item.bcbCode)
					}
				})
				this.$u.loading('保存中...');
				this.params.visitServiceCodes = visitServiceCodes;
				this.params.visitPublicityCodes = visitPublicityCodes;
				const params = Object.assign(this.params, {recordUuid: this.visitSuccessBean.recordUuid})
				checkService.submitVisitRecord(params).then((dr) => {
					this.$u.hideLoading();
					if (dr.success) {
						this.$modal.alert('提交成功', () => {
							this.backPrev({
								paramKey: 'refreshBack',
								param: true,
							});
						});
					}
				}).catch(er => {
					this.$u.hideLoading();
					this.$u.toast(er);
				});
			}
		},
		mounted() {
			let a = this.$u.deepClone(this.$u.dic.getByDictCode(this.$u.dic.DIC_KEYS.LOC_VISIT_SERVICE_CODE) || []);
			let b = this.$u.deepClone(this.$u.dic.getByDictCode(this.$u.dic.DIC_KEYS.LOC_VISIT_PUBLICITY_CODE) || []);
			a.forEach(item => {
				item.isActive = false
			})
			b.forEach(item => {
				item.isActive = false
			})
			this.visitServiceCodes = a;
			this.visitPublicityCodes = b;
      this.getLocation();
		}
	}
</script>

<style lang="scss" scoped>
	.page {
		padding: 0;
	}


	.ma-16 {
		margin: 0 16px
	}

	//.query-btn {
		//display: flex;
		//position: fixed;
		//width: 100%;
		//z-index: 999;
		//bottom: var(--window-bottom, 0);
		//margin-bottom: 15px;

	//	.u-btn {
	//		width: 100%;
	//	}
	//}
</style>
